<template>
	<view class="weidian">
		<view class="weidian_head">
			<!-- #ifdef MP-WEIXIN || APP-PLUS -->
			<view class="ww100" :style="'height:' + topBarTop() + 'px;'"></view>
			<view class="tc  head_top" :style="topBarHeight() == 0 ? '' : 'height:' + topBarHeight() + 'px;'">
				<view class="reg180" @click="goback"><text class="icon iconfont icon-jiantou"></text></view>
				<view class="fb">我的店铺</view>
			</view>
			<!-- #endif -->
			<view>
				<view class="weidian_head_body_bottom">
					<view class="weidian_head_body_bottom_item">
						<view class="f24 gray3 mb20">累计提现(元)</view>
						<text class="f36 gray3 fb">{{ shop_data.supplier.cash_money }}</text>
					</view>
					<view class="weidian_head_body_bottom_item">
						<view class="f24 gray3 mb20">累计成交(笔)</view>
						<text class="f36 gray3 fb">{{ shop_data.totalCount }}</text>
					</view>
					<view class="weidian_head_body_bottom_item">
						<view class="f24 gray3 mb20">今日成交(笔)</view>
						<text class="f36 gray3 fb">{{ shop_data.todayCount }}</text>
					</view>
					<view class="weidian_head_body_bottom_item">
						<view class="f24 gray3 mb20">可提现</view>
						<text class="f36 gray3 fb">{{ shop_data.supplier.money }}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="weidian_body">
			<view class="seller_center_body_order">
				<view class="seller_center_body_order_head">
					<text class="f32 gray3 fb">我的订单</text>
					<text class="seller_center_body_order_head_more" @click="jumpPage('/pages/user/my_shop/my_shop_order?fill=1')">
						全部订单
						<text class="icon iconfont icon-jiantou f24"></text>
					</text>
				</view>
				<view class="seller_center_body_order_body">
					<view class="seller_center_body_order_body_item" v-for="(item, index) in order_menu_list" :key="index">
						<view @click="jumpPage(item.url)">
							<image :src="item.image" mode=""></image>
							<view class="f26 gray3">{{ item.title }}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="weidian_body_menu_list">
				<view class="weidian_body_menu_list_item" v-for="(item, index) in menu_list" :key="index" @click="jumpPage(item.url)">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" :src="item.left_icon" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">{{ item.title_left }}</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
					<view class="weidian_body_menu_list_title_right"></view>
				</view>
				<view class="weidian_body_menu_list_item" v-if="shop_data.supplier.status != 0">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" src="/static/icon/commodity_management.png" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">商品管理</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
					<view class="weidian_body_menu_list_title_right">未缴纳保证金</view>
					<view class="weidian_body_menu_list_title_right"></view>
				</view>
				<view class="weidian_body_menu_list_item" v-else @click="jumpPage('/pages/user/my_shop/pro_admin')">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" src="/static/icon/commodity_management.png" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">商品管理</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
					<view class="weidian_body_menu_list_title_right"></view>
				</view>
				<view class="weidian_body_menu_list_item">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" src="/static/icon/store_deposit.png" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">店铺保证金</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
					<view class="weidian_body_menu_list_title_right" v-if="shop_data.supplier.status == 0">已缴纳</view>
					<view class="weidian_body_menu_list_title_right" v-if="shop_data.supplier.status == 10">申请退出</view>
					<view class="weidian_body_menu_list_title_right" v-if="shop_data.supplier.status == 20" @click="gotoPay">立即交纳</view>
				</view>
				<view v-if="is_open == 1" class="weidian_body_menu_list_item" @click="toLive">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" src="/static/icon/store_live.png" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">我的直播</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
				</view>
				<view class="weidian_body_menu_list_item" @click="gotoPage('/pages/plus/chat/supplier_chat_list')">
					<view class="weidian_body_menu_list_left_icon"><image class="left_iconimg" src="/static/icon/store_live.png" mode=""></image></view>
					<view class="weidian_body_menu_list_title_left">客服消息</view>
					<view class="weidian_body_menu_list_right_icon icon iconfont icon-jiantou"></view>
					<view class="weidian_body_menu_list_title_right">{{ msg_count }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			order_menu_list: [
				{
					image: '/static/icon/pay.png',
					title: '待支付',
					url: '/pages/user/my_shop/my_shop_order?dataType=payment'
				},
				{
					image: '/static/icon/daifahuo.png',
					title: '待发货',
					url: '/pages/user/my_shop/my_shop_order?dataType=delivery'
				},
				{
					image: '/static/icon/daishouhuo.png',
					title: '待收货',
					url: '/pages/user/my_shop/my_shop_order?dataType=received'
				},
				{
					image: '/static/icon/sell.png',
					title: '退款/售后',
					url: '/pages/user/my_shop/after_sale?tianchong=1'
				}
			],
			menu_list: [
				{
					title_left: '店铺首页',
					title_right: '',
					left_icon: '/static/icon/store_home.png',
					right_icon: '',
					url: '/pages/shop/shop'
				},
				{
					title_left: '店铺数据',
					title_right: '',
					left_icon: '/static/icon/store_data.png',
					right_icon: '',
					url: '/pages/user/my_shop/my_shop_data'
				}
			],
			shop_data: {
				supplier: {}
			},
			user_id: '',
			shop_supplier_id: '',
			is_open: 0,
			is_full: 0,
			statusBarHeight: 0,
			titleBarHeight: 0,
			msg_count: 0
		};
	},
	onShow() {
		this.get_user_Data();
		this.get_shop_Data();
	},
	onLoad() {
		this.GetStatusBarHeight();
	},
	methods: {
		GetStatusBarHeight() {
			const SystemInfo = uni.getSystemInfoSync();
			// #ifdef MP-WEIXIN
			let statusBarHeight = SystemInfo.statusBarHeight;
			this.statusBarHeight = uni.getMenuButtonBoundingClientRect().top;
			this.titleBarHeight = uni.getMenuButtonBoundingClientRect().height;
			// #endif
			// #ifndef MP-WEIXIN
			this.statusBarHeight = SystemInfo.statusBarHeight;
			this.titleBarHeight = 30;
			// #endif
		},
		jumpPage(path) {
			if (path.indexOf('?') != -1) {
				this.gotoPage(path + '&shop_supplier_id=' + this.shop_supplier_id);
			} else {
				this.gotoPage(path + '?shop_supplier_id=' + this.shop_supplier_id);
			}
		},
		// 获取用户数据
		get_user_Data() {
			let self = this;
			uni.showLoading({
				title: '加载中'
			});
			self._get('user.index/detail', {}, function(res) {
				self.user_id = res.data.userInfo.user_id;
				self.shop_supplier_id = res.data.userInfo.supplierUser.shop_supplier_id;
				self.menu_list[0].url = '/pages/shop/shop?shop_supplier_id=' + self.shop_supplier_id;
				uni.hideLoading();
			});
		},
		// 获取店铺成交数据
		get_shop_Data() {
			let self = this;
			self._get('supplier.index/tradeData', {}, function(res) {
				self.shop_data = res.data;
				self.is_open = res.data.is_open;
				self.is_full = res.data.supplier.is_full;
				self.msg_count = res.data.msg_count;
			});
		},
		goback() {
			uni.navigateBack();
		},
		// 支付保证金
		gotoPay() {
			this.gotoPage('/pages/order/deposit-pay');
		},
		toLive() {
			//if (this.is_full == 1) {
			this.gotoPage('/pages/user/my_shop/my_live/my-live/my-live?');
			/*} else {
					uni.showModal({
						title: '提示',
						content: '请先前往后台商户PC端完善个人资料并添加商品'
					})
				}*/
		}
	}
};
</script>

<style>
page {
	background: #ffffff;
}

.iconfont {
	font-size: 14px;
}

.reg180 {
	padding-right: 20rpx;
	text-align: right;
	transform: rotateY(180deg);
	position: absolute;
	bottom: 0;
}

.head_top .icon-jiantou {
	color: #333333;
	font-size: 30rpx;
}

.head_top {
	width: 100%;
	position: relative;
	/* padding-top: var(--status-bar-height); */
	height: 30px;
	line-height: 30px;
	color: #333333;
	font-size: 36rpx;
}

.bg_topimg {
	position: absolute;
	top: 0;
	width: 100%;
	height: 400rpx;
	z-index: -1;
}

.weidian {
}

.weidian_head {
	width: 100%;
	padding-bottom: 195rpx;
	/* height: 360rpx; */
	background: linear-gradient(-90deg, #ffc89b 0%, #ffe3c4 100%);
}

.weidian_body {
	/* margin-top: -125rpx; */
	position: relative;
}

.weidian_head_body_top {
	width: 100%;
	height: 200rpx;
}

.weidian_head_body_top_left {
	width: 50%;
	height: 200rpx;
	display: inline-block;
	font-size: 30rpx;
	color: white;
	padding-top: 40rpx;
	padding-left: 45rpx;
	box-sizing: border-box;
}

.weidian_head_body_top_left view {
	margin-top: 20rpx;
}

.weidian_head_body_top_left image {
	width: 36rpx;
	height: 36rpx;
	display: inline-block;
}

.weidian_head_body_top_right {
	width: 30%;
	display: inline-block;
	position: relative;
	top: -25rpx;
	left: 120rpx;
}

.weidian_head_body_top_right button {
	width: 82%;
	height: 60rpx;
	line-height: 60rpx;
	border-radius: 30rpx;
	color: #f36a23;
}

.weidian_head_body_bottom {
	width: 100%;
	padding-top: 72rpx;
	box-sizing: border-box;
	font-size: 26rpx;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.weidian_head_body_bottom_item {
	display: inline-block;
	float: left;
	color: white;
	text-align: center;
}

/* 我的订单css */
.seller_center_body_order {
	width: 710rpx;
	background-color: white;
	margin: 0 auto;
	border-radius: 20rpx;
	padding: 30rpx 24rpx 30rpx 30rpx;
	box-sizing: border-box;
	position: absolute;
	top: -170rpx;
	left: 0;
	right: 0;
}

.seller_center_body_order_head {
	font-size: 30rpx;
	border-bottom: 1rpx solid #d9d9d9;
	padding-bottom: 20rpx;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

.seller_center_body_order_head_more {
	font-size: 26rpx;
	color: #666666;
	display: flex;
	align-items: center;
}

.seller_center_body_order_head_more .icon-jiantou {
	font-size: 24rpx;
	color: #666666;
}

.seller_center_body_order_body {
	width: 100%;
	padding-top: 30rpx;
}

.seller_center_body_order_body_item {
	display: inline-block;
	width: 25%;
	text-align: center;
}

.seller_center_body_order_body image {
	width: 60rpx;
	height: 60rpx;
	margin: 0 auto;
	margin-bottom: 14rpx;
}

/* 订单css  END */
.weidian_body_menu_list {
	/* width: 90%; */
	padding-left: 50rpx;
	font-size: 30rpx;
	color: #484848;
	background-color: #ffffff;
	border-top: 120rpx solid #f2f2f2;
}

.weidian_body_menu_list_item {
	width: 97%;
	height: 100rpx;
	line-height: 100rpx;
	border-bottom: 1rpx #d9d9d9 solid;
	box-sizing: border-box;
}

.weidian_body_menu_list_title_left {
	display: inline-block;
	float: left;
}

.weidian_body_menu_list_right_icon {
	display: inline-block;
	float: right;
	font-size: 26rpx;
}

.weidian_body_menu_list_left_icon {
	display: inline-block;
	float: left;
	margin-right: 10rpx;
}

.weidian_body_menu_list_title_right {
	display: inline-block;
	float: right;
	color: #d5d5d5;
	font-size: 24rpx;
	position: relative;
	/* top: 5rpx; */
	margin-right: 5rpx;
}

.left_iconimg {
	width: 36rpx;
	height: 36rpx;
	display: inline-block;
}
</style>
